<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="Free bootstrap documentation template">
    <title>{{collection.name}}</title>
    <!-- using online links -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
    <link rel="stylesheet" href="https://malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.min.css">
    <!-- using local links -->
    <link rel="stylesheet" href="css/main.min.css">
    <link rel="stylesheet" href="css/sidebar-themes.min.css">
    <link rel="stylesheet" href="css/bootstrap-treeview.min.css">
    <link rel="stylesheet" href="css/postman.min.css">

    <link rel="shortcut icon" type="image/png" href="img/favicon.png" /> </head>

<body>
    <div class="page-wrapper toggled light-theme">
        <div class="modal dark-background" id="snippetModal" tabindex="-1" role="dialog" aria-labelledby="documentation-response-modal" style="display: none;">
        <div class="modal-dialog" role="document">
          <div class="modal-header">
            <div class="title">Example Response</div>
            <button type="button" class="close btn-circle" data-dismiss="modal" aria-label="Close">
              <div>
              <span id="closeModal" aria-hidden="true">×</span>
              </div>
            </button>
          </div>
          <div class="modal-content">
            <div class="modal-body" style="width: 540.5px;">
              <pre class="  language-javascript">
                  <code class=" language-javascript"></code>
              </pre>
            </div>
          </div>
        </div>
      </div>
        <nav id="sidebar" class="sidebar-wrapper">
            <div class="sidebar-content">
                <!-- sidebar-brand  -->
                <div class="sidebar-item sidebar-brand text-white font-weight-bold">API Documentation</div>
                <!-- sidebar-header  -->
                <!-- sidebar-menu  -->
                <div class=" sidebar-item sidebar-menu">
                    <div id="tree"></div>
                </div>
                <!-- sidebar-menu  -->
            </div>
        </nav>
        <!-- page-content  -->
        <main class="page-content">
            <div id="overlay" class="overlay"></div>
            <div class="container-fluid">
                <div class="row d-flex align-items-center p-3 border-bottom">
                    <div class="col-md-1">
                        <a id="toggle-sidebar" class="btn rounded-0 p-3" href="#"> <i class="fas fa-bars"></i> </a>
                    </div>
                    <div class="col-md-9"></div>
                    <div class="col-md-2 text-left">
                        {%- if download_enabled and collection.file_name is not none%}
                            <a href="{{collection.file_name}}" class="btn btn-sm btn-primary btn-rounded" download>
                                <i class="fas fa-download"></i> Collection</a>
                        {% endif %}
                        {%- if download_enabled and collection.env_file_name is not none%}
                            <a href="{{collection.env_file_name}}" class="btn btn-sm btn-primary btn-rounded" download>
                                <i class="fas fa-download"></i> Env</a>
                        {% endif %}
                    </div>
                </div>
                <div class="row p-lg-4">
                    <article class="main-content col-md-12 pr-lg-9" id="doc-body">
                        <div class="row row-no-padding row-eq-height">
                            <div class="col-md-6 col-xs-12">
                                <div class="api-information">
                                    <div class="collection-name">
                                        <p>{{collection.name}}</p>
                                    </div>
                                    <div class="collection-description">
                                        <p>{{collection.description}}</p>
                                    </div>
                                </div>
                            </div>
                        </div>

                        {%- for api in api_info %}
                        <div class="row row-no-padding row-eq-height">
                            <div class="col-md-6 col-xs-12 section">
                                <div class="api-information" id="{{api.id}}">
                                     <div class="heading">
                                        <div class="name">
                                            <span class="{{api.method}} method" >{{api.method}}</span>
                                            {{api.name}} <span class="lock-icon"></span>
                                        </div>
                                     </div>
                                    {%- if api.url is defined and api.url is not none%}
                                    <div class="url">{{api.url}}</div>
                                    {% endif %}
                                    {%- if api.description is defined and api.description is not none%}
                                    <div class="description request-description">
                                        <p>{{api.description|safe}}</p>
                                    </div>
                                    {% endif %}

                                    {%- if api.headers is defined and api.headers is not none %}
                                    <div class="request-body">
                                        <div class="body-heading">HEADERS</div>
                                        <hr>
                                        {%- for item in api.headers %}
                                          <div class="param row">
                                            <div class="name col-md-3 col-xs-12">{{ item.key }}</div>
                                            <div class="value col-md-9 col-xs-12">{{ item.value | safe}}</div>
                                            <div class="description col-md-9 col-xs-12"><p>{{ item.description | safe}}</p>
                                            </div>
                                          </div>
                                        {%- endfor %}
                                    </div>
                                    {% endif %}

                                    {%- if api.params is defined and api.params is not none %}
                                    <div class="request-body">
                                        <div class="body-heading">PARAMS</div>
                                        <hr>
                                        {%- for item in api.params %}
                                          <div class="param row">
                                            <div class="name col-md-3 col-xs-12">{{ item.key }}</div>
                                            <div class="value col-md-9 col-xs-12">{{ item.value | safe}}</div>
                                            <div class="description col-md-9 col-xs-12"><p>{{ item.description | safe}}</p>
                                            </div>
                                          </div>
                                        {%- endfor %}
                                    </div>
                                    {% endif %}

                                    {%- if api.path_variables is defined and api.path_variables is not none %}
                                    <div class="request-body">
                                        <div class="body-heading">PATH VARIABLES</div>
                                        <hr>
                                        {%- for item in api.path_variables %}
                                          <div class="param row">
                                            <div class="name col-md-3 col-xs-12">{{ item.key }}</div>
                                            <div class="value col-md-9 col-xs-12">{{ item.value | safe}}</div>
                                            <div class="description col-md-9 col-xs-12"><p>{{ item.description | safe}}</p>
                                            </div>
                                          </div>
                                        {%- endfor %}
                                    </div>
                                    {% endif %}

                                    {%- if api.body is defined and api.body is not none %}
                                    <div class="request-body">
                                        <div class="body-heading">BODY <span class="body-type">{{ api.body.mode }}</span></div>
                                        <hr>
                                        {%- if api.body.mode == 'raw' and api.body.raw is not none %}
                                            <div class="raw-body code-snippet">
                                              <pre class="body-block click-to-expand-wrapper is-snippet-wrapper {{ 'is-expandable' if api.body.raw|length > 130 }}" data-title="{{api.name}}">
                                                  <code>
                                                    {{api.body.raw|safe}}
                                                  </code>
                                              </pre>
                                            </div>
                                        {% endif %}

                                        {%- if api.body.key_values is not none %}
                                            {%- for item in api.body.key_values %}
                                              <div class="param row">
                                                <div class="name col-md-3 col-xs-12">{{ item.key }}</div>
                                                <div class="value col-md-9 col-xs-12">{{ item.value }}</div>
                                                <div class="description col-md-9 col-xs-12"><p>{{ item.description }}</p>
                                                </div>
                                              </div>
                                            {%- endfor %}
                                        {% endif %}
                                    </div>
                                    {% endif %}
                                </div>
                            </div>
                            {%- if api.examples|length > 0 %}
                            <div class="col-md-6 col-xs-12 examples">
                                <div class="sample-request">
                                    <div class="heading">
                                        <span>Example Request</span>
                                    </div>
                                    <div class="responses-index">
                                        <div class="dropdown response-name">
                                            <button class="btn {{'dropdown-toggle' if api.examples|length > 1 }}  responses-dropdown truncate" type="button" id="f678f251-1750-4e3a-b5d8-05b4c6b0fb37_dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                                              <span id="selected" class="response-name-label">{{api.examples[0].name}}</span>
                                                <span class="caret"></span>

                                            </button>

                                            <ul class="dropdown-menu" aria-labelledby="f678f251-1750-4e3a-b5d8-05b4c6b0fb37_dropdown">
                                                {%- for example in api.examples %}
                                                <li class="truncate" data-request-info="{{example.request_id}}" data-response-info="{{example.id}}">{{example.name}}</li>
                                                {%- endfor %}
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                {%- for example in api.examples %}
                                <div class="formatted-requests {{ 'hide' if loop.index0 != 0 }}" data-request-id="{{example.request_id}}"  data-id="{{example.id}}">
                                    <div class="request code-snippet">
                                        <div>
                                            <pre class="click-to-expand-wrapper is-snippet-wrapper {{ 'is-expandable' if example.request_body|trim|length > 180 }}" data-title="{{example.name}}">
                                                <code class="is-highlighted">{{example.request_body|safe}}</code>
                                            </pre>
                                        </div>
                                    </div>
                                    {%- if example.response_body is defined and example.response_body is not none%}
                                    <div class="sample-response">
                                        <div class="heading">
                                            <span>Example Response</span>
                                        </div>
                                        <div class="responses-index">
                                            <div class="response-status">
                                                <span>{{example.code}} - {{example.status}}</span>
                                            </div>
                                        </div>
                                        <div class="responses code-snippet">
                                            <div>
                                                <pre class="click-to-expand-wrapper is-snippet-wrapper {{ 'is-expandable' if example.response_body|trim|length > 180 }}" data-title="{{example.name}}">
                                                    <code class="is-highlighted">{{example.response_body|safe}}</code>
                                                </pre>
                                            </div>
                                        </div>
                                    </div>
                                    {% endif %}
                                </div>
                                {%- endfor %}
                            </div>
                            {% endif %}
                        </div>
                        {%- endfor %}
                    </article>
                </div>
            </div>
        </main>
        <!-- page-content" -->
    </div>
    <!-- page-wrapper -->
    <!-- using online scripts -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous">
    </script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous">
    </script>
    <script src="https://malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
    <script src="js/bootstrap-treeview.min.js"></script>
    <script src="js/main.min.js"></script>
    <script type="application/javascript">
        var data = {{ side_tree|safe }}
        $('#tree').treeview({
            data: data,
            levels: 10,
            expandIcon: 'fas fa-caret-right',
            collapseIcon: 'fas fa-caret-down',
            enableLinks: true,
            showIcon: true,
            showMethod: true
        });
    </script>

</body>

</html>